<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>学生列表</title>

    <style>
        td {
            text-align: center;
        }

        tr:first-child {
            font-weight: bold;
        }

        tr:nth-child(odd) {
            background-color: chocolate;
        }

        #form {
            width: 60%;
            display: flex;
            margin-bottom: 10px;

        }

        img{
            width: 50px;
            height: 50px;
        }


    </style>
</head>
<body>
<div align="center">
    <h3>学生信息管理系统</h3>
    <p>欢迎您，${admin.account} <a href="#">退出</a></p>

    <div id="form">
        <div>
            <a href="/student/add">新增学生</a>
        </div>
        <div style="margin-left: 50px">
            <form action="/student/list">
                姓名：<input type="text" name="name" value="${name}"> &emsp;&emsp;
                住址：<input type="text" name="address" value="${address}"> &emsp;
                <input type="submit" value="搜索">
            </form>
        </div>
    </div>


    <table border="1" width="60%">
        <tr>
            <td>编号</td>
            <td>姓名</td>
            <td>年龄</td>
            <td>性别</td>
            <td>电话</td>
            <td>住址</td>
            <td>操作</td>
        </tr>
        <c:if test="${empty studentList}">
            <tr>
                <td colspan="7">没有查询到任何记录！</td>
            </tr>
        </c:if>
        <c:forEach var="stu" items="${studentList}">
            <tr>
                <td>${stu.id}</td>
                <td>${stu.name}</td>
                <td>${stu.age}</td>
                <td>${stu.genderStr}</td>
                <td>${stu.phone}</td>
                <td>${stu.address}</td>
                <td><img src="/upload/${stu.headImgPath}"></td>
                <td>
                    <a href="/student/update?id=${stu.id}">编辑</a> &emsp;
                    <a href="#" onclick="removeStudent(${stu.id})">删除</a>
                </td>
            </tr>
        </c:forEach>
    </table>
    <p>
        <a href="/student/list?pageIndex=1&name=${name}&address=${address}">首页</a> &emsp;
        <a href="/student/list?pageIndex=${pageIndex - 1 <=0 ? 1:pageIndex - 1}&name=${name}&address=${address}">上一页</a>&emsp;
        <a href="/student/list?pageIndex=${pageIndex + 1 >= totalPage? totalPage:pageIndex + 1}&name=${name}&address=${address}">下一页</a>&emsp;
        <a href="/student/list?pageIndex=${totalPage}&name=${name}&address=${address}">尾页</a>&emsp;
        当前第${pageIndex}页，共${totalPage}页
    </p>

</div>
<script src="../../statics/js/jquery-3.6.3.min.js"></script>
<script>
    function removeStudent(id){
        if (confirm("确定删除吗？")){
            $.ajax({
                url:"/student/remove",
                type:"post",
                data:"id="+id,
                success:function (data){
                    if (data.success == 1){
                        alert("删除成功!");
                        window.location.href = "/student/list";
                    }else{
                        alert("删除失败!")
                    }
                },
                dataType:"json"
            })
        }

    }
</script>
</body>
</html>